<template>
	<view>
		<uni-row :gutter="20" class="pageRoot" style="margin:0 auto;">
			<slot name="title"></slot>
			
			<view class="reportTime">报告将于{{ endTime }}过期</view>
			<slot name="PF_SF"></slot>
			<uni-col :span="24" style="padding:20px 15px 0">
				<view class="reportModel">
					<view class="title">
						<view class="left">风险信息</view>
					</view>
					<view class="tOInfo">
						<view class="tOTitle">本次报告命中<span
								style="color:rgb(251, 101, 0)">{{ reportItem.length }}条</span>异常规则信息
						</view>
						<view class="tODesc">风险项共{{ reportItem.length }}条</view>
						<view class="tOList">
							<view class="tOItem" v-for="(item, index) in reportItem" :key="index">
								<image :src="correctIcon" mode="widthFix" style="width: 22rpx;" />
								<view>{{ item.name_rule }}</view>
							</view>
						</view>
						<view class="explain">
							<view class="explainTitle">说明</view>
							<view class="explainDesc">
								一般风险:指30/60/90天逾期资信不佳。<br />
								中风险:客户有过贷款逾期90天以上未还。<br />
								高风险:客户逾期后失联。<br />
								申请极少、极多、频繁都会命中风险规则。 申请极少的权重达不到拒绝风险，极少这里只是申请类型的展示。申请的次数越多越频繁，命中的风险规则越大。
							</view>
						</view>
						<view class="proposal">
							<view class="proposalTitle">建议</view>
							<view class="proposalDesc">请保持良好的借贷习惯,切勿频繁申请,拒绝不明平台的审核邀请。不去注册申请新的网贷，按时还款已有的网贷，3-6个月会慢慢恢复分数。
							</view>
						</view>
						<slot name="YQQK"></slot>
					</view>
				</view>
			</uni-col>
			<uni-col :span="24" style="padding:20px 15px 0">
				<view class="reportModel">
					<view class="title">
						<view class="left" style="width:156px">自身风险筛查</view>
					</view>
					<view class="risk">
						<image :src="exponent" mode="widthFix" style="width: 400rpx;" />
						<view class="riskText">风险指数（低→高)</view>
					</view>
					<view class="hit">
						<view class="hitContent">
							<view style="margin-bottom: 10px;">{{ sl_id_allnum }}</view>
							<view>身份证命中风险/次</view>
						</view>
						<view class="hitContent">
							<view style="margin-bottom: 10px;">{{ sl_cell_allnum }}</view>
							<view>手机号命中风险/次</view>
						</view>
					</view>
					<view class="explain" style="width:90%;margin:0 0 15px;">
						<view class="explainTitle">说明</view>
						<view class="explainDesc">
							1.查询范围：银行、非银：持牌网络小贷、持牌小贷、持牌消费金融、持牌融资租赁、持牌汽车金融、其他（信保、信托等)。<br />
							2.查询类型：法院失信人、被执行人、限制高消费、逾期（一般风险、中风险、高风险、资信不佳、拒绝)。
						</view>
					</view>
				</view>
			</uni-col>
			<uni-col :span="24" style="padding:20px 15px 0">
				<view class="reportModel">
					<view class="title">
						<view class="left" style="width:173px">借贷申请数据</view>
					</view>
					<view class="charts">
						<view class="echart" id="mychart" :style="myChartStyle"></view>
					</view>
					<view class="explain" style="width:90%;margin:0">
						<view class="explainTitle">说明</view>
						<view class="explainDesc">
							1.查询类型：参考自身风险筛查。<br />
							2.查询范围：参考自身风险筛查。<br />
						</view>
					</view>
					<view class="proposal" style="width:90%">
						<view class="proposalTitle">建议</view>
						<view class="proposalDesc">请保持良好的借贷习惯,切勿频繁申请,拒绝不明平台的审核邀请。</view>
					</view>
					<view class="searchTime">
						<view :class="[searchTimeIndex == index ? 'timeItem timeItemActive' : 'timeItem']"
							v-for="(item, index) in searchTime" @click="searchTimeIndex = index +''" :key="index">
							{{ item }}
						</view>
					</view>
					<view class="searchContent" v-for="(item,index) in searchTextData" :key="index">
						<view class="searchTitle">
							{{ item.title }}
							<view class="searchHr"></view>
						</view>
						<view class="searchText" v-for="(v, k) in item.item" :key="k">
							<view>{{ v }}</view>
							<view>
								{{ searchData[searchTimeIndex][index][k][0] }}家&nbsp;&nbsp;
								{{ searchData[searchTimeIndex][index][k][1] }}次
							</view>
						</view>
					</view>
					<view class="explain" style="width:90%">
						<view class="explainTitle">说明</view>
						<view class="explainDesc">
							此数据不是借贷数据，是借贷申请机构数（家）和借贷申请次数（次）<br />
							借贷申请机构数（家）=按身份证号查询命中机构数+按手机号查询命中机构数<br />
							借贷申请次数（次）=按身份证号查询命中次数+按手机号查询命中次数
						</view>
					</view>
					<view class="proposal" style="width:90%">
						<view class="proposalTitle">建议</view>
						<view class="proposalDesc">报告检测的是12个月内的申请数据，含同一机构，如果申请过于频繁会对评分有影响，请保持良好的借贷习惯，切勿频繁申请。</view>
					</view>
					<view class="reportTable">
						<view class="tableTitle">详细业务类型申请行为（次）</view>
						<uni-table>
							<uni-tr>
								<uni-th align="center" width="122">时间</uni-th>
								<uni-th align="center" width="60">近15天</uni-th>
								<uni-th align="center" width="65">近1个月</uni-th>
								<uni-th align="center" width="65">近3个月</uni-th>
								<uni-th align="center" width="65">近6个月</uni-th>
								<uni-th align="center" width="72">近12个月</uni-th>
							</uni-tr>
							<uni-tr v-for="(item ,index) in tableData1">
								<uni-td align="center">{{item.title}}</uni-td>
								<uni-td align="center">{{item.d15}}</uni-td>
								<uni-td align="center">{{item.m1}}</uni-td>
								<uni-td align="center">{{item.m3}}</uni-td>
								<uni-td align="center">{{item.m6}}</uni-td>
								<uni-td align="center">{{item.m12}}</uni-td>
							</uni-tr>
						</uni-table>
					</view>
					<view class="explain" style="width:90%;margin-bottom:0">
						<view class="explainTitle">说明</view>
						<view class="explainDesc">
							借贷申请次数=按身份证号查询命中次数+按手机号查询命中次数<br />
							消费类分期:借贷用于购买消费品并分期偿还的业务<br />
							现金类分期:支取现金并分期偿还的业务<br />
							代偿类分期:借贷用于偿还已有借款并分期偿还的业务<br />
							非银其他:包括担保、信保等。<br />
						</view>
					</view>

					<view class="reportTable">
						<view class="tableTitle">关联机构类型详情</view>
						<uni-table>
							<uni-tr>
								<uni-th align="center" width="122">时间</uni-th>
								<uni-th align="center" width="60">近15天</uni-th>
								<uni-th align="center" width="65">近1个月</uni-th>
								<uni-th align="center" width="65">近3个月</uni-th>
								<uni-th align="center" width="65">近6个月</uni-th>
								<uni-th align="center" width="72">近12个月</uni-th>
							</uni-tr>
							<uni-tr v-for="(item ,index) in tableData2">
								<uni-td align="center">{{item.title}}</uni-td>
								<uni-td align="center">{{item.d15}}</uni-td>
								<uni-td align="center">{{item.m1}}</uni-td>
								<uni-td align="center">{{item.m3}}</uni-td>
								<uni-td align="center">{{item.m6}}</uni-td>
								<uni-td align="center">{{item.m12}}</uni-td>
							</uni-tr>
						</uni-table>

					</view>
					<view class="explain" style="width:90%">
						<view class="explainTitle">说明</view>
						<view class="explainDesc">
							借贷申请机构数=按身份证号查询命中机构数+按手机号查询命中机构数
						</view>
					</view>
					<view class="proposal" style="width:90%">
						<view class="proposalTitle">建议</view>
						<view class="proposalDesc">减少申请借贷频率，保持良好的借贷习惯。</view>
					</view>
				</view>
			</uni-col>
			<uni-col :span="24" style="padding:20px 15px 0">
				<view class="reportModel">
					<view class="title">
						<view class="left" style="width:173px">借贷申请时段</view>
					</view>
					<view class="reportTable">
						<view class="tableTitle" style="margin-top:15px;">申请机构数</view>
						<uni-table>
							<uni-tr>
								<uni-th align="center" width="70">时间</uni-th>
								<uni-th align="center" width="50">近15天</uni-th>
								<uni-th align="center" width="50">近1个月</uni-th>
								<uni-th align="center" width="50">近3个月</uni-th>
								<uni-th align="center" width="50">近6个月</uni-th>
								<uni-th align="center" width="60">近12个月</uni-th>
							</uni-tr>
							<uni-tr v-for="(item ,index) in tableData3">
								<uni-td align="center">{{item.title}}</uni-td>
								<uni-td align="center">{{item.d15}}</uni-td>
								<uni-td align="center">{{item.m1}}</uni-td>
								<uni-td align="center">{{item.m3}}</uni-td>
								<uni-td align="center">{{item.m6}}</uni-td>
								<uni-td align="center">{{item.m12}}</uni-td>
							</uni-tr>
						</uni-table>
					</view>
					<view class="explain" style="width:90%;margin-bottom:15px;">
						<view class="explainTitle">说明</view>
						<view class="explainDesc">
							借贷申请机构数=按身份证号查询命中机构数+按手机号查询命中机构数
						</view>
					</view>
				</view>
			</uni-col>
			<uni-col :span="24" style="padding:20px 15px 0">
				<view class="reportModel">
					<view class="title">
						<view class="left" style="width:173px">特殊名单验证</view>
					</view>
					<view class="searchTime">
						<view style="width:25%"
							:class="[searchNameIndex == index ? 'timeItem timeItemActive' : 'timeItem']"
							v-for="(item, index) in searchName" @click="searchNameIndex=index" :key="index">
							{{ item }}
						</view>
					</view>
					<view class="searchContent">
						<view class="searchName" v-for="(item,index) in searchNameData[searchNameIndex]" :key="index">
							<view :class="[item.check ? 'searchNameUp searchNameUpActive' : 'searchNameUp']">
								<view>{{ item.left }}</view>
								<view>{{ item.right }}</view>
							</view>
							<view class="searchNameDown">
								<view>命中次数：{{ item.smallLeft }}次</view>
								<view>最近一次距离今时间：{{ item.smallRight }}</view>
							</view>
						</view>
					</view>
					<view class="explain" style="width:90%">
						<view class="explainTitle">说明</view>
						<view class="explainDesc">
							一般风险：指30/60/90天逾期资信不佳。中风险：客户有过贷款逾期90天以上未还。高风险：客户逾期后失联。<br />
						</view>
					</view>
					<view class="proposal" style="width:90%;margin-bottom:15px;">
						<view class="proposalTitle">建议</view>
						<view class="proposalDesc">
							1、如有逾期请及时还清，保持良好信用。<br />
							2、请履行相关约定，避免发生违约行为。<br />
							3、已命中法院失信名单等，若非本人行为，请联系相关部门进行处理。
						</view>
					</view>
				</view>
			</uni-col>
			<uni-col :span="24" style="padding:20px 15px 0">
				<view class="reportModel">
					<view class="title">
						<view class="left" style="width:173px">失信执行总览</view>
					</view>
					<view class="implementTitle">失信被执行{{ ExecutionLimited.fysx.length != 0 ? '' : '（暂无）' }}</view>
					<view class="implementContent" v-for="(item, index) in ExecutionLimited.fysx" :key="index"
						style="margin-bottom:5px;">
						<view class="implementItem" v-for="(v,k) in item" :key="k">
							{{ v }}
						</view>
					</view>
					<view class="implementTitle">限高被执行{{ ExecutionLimited.fyxg.length != 0 ? '' : '（暂无）' }}</view>
					<view class="implementContent" v-for="(item, index) in ExecutionLimited.fyxg" :key="index"
						style="margin-bottom:5px;">
						<view class="implementItem" v-for="(v,k) in item" :key="k">
							{{ v }}
						</view>
					</view>
					<view class="explain" style="width:90%">
						<view class="explainTitle">说明</view>
						<view class="explainDesc">
							失信被执行人，是指有履行能力但是逃避执行、规避执行、抗拒执行的被执行人，俗称老赖。法院被执行人是指在法定的上诉期满后，或终审判决作出后，拒不履行法院判决或仲裁裁决的当事人。
						</view>
					</view>
					<view class="proposal" style="width:90%;margin-bottom:15px;">
						<view class="proposalTitle">建议</view>
						<view class="proposalDesc">
							请立即履行生效法律文书确定的义务，向相关法院申请移出失信被执行人和法院被执行人名单。
						</view>
					</view>
				</view>
			</uni-col>
			<uni-col :span="24" style="padding:20px 15px 0">
				<view class="reportModel">
					<view class="title">
						<view class="left" style="width:273px">提高信用评分消除风险的建议</view>
					</view>
					<view class="content">
						1.信用卡一年内申请不超过6次,含同一机构,网贷3个月内申请不超过20次,控制申请频率;<br />
						2.如果有逾期或者被执行等不良记录,保持良好信用1-2年,记录可以滚动覆盖过去;<br />
						3.保持良好的借贷习惯,切勿频繁申请,拒绝不明平台的审核邀请;<br />
						4.减少和网贷黑名单这类人群的联系,提高自己朋友圈优良信用人群比例。
					</view>
				</view>
			</uni-col>
			<uni-col :span="24" style="padding:20px 15px 0;margin-bottom:55px;">
				<view class="reportModel">
					<view class="title">
						<view class="left" style="width:173px">大数据报告说明</view>
					</view>
					<view class="content">
						报告由本人授权查询，本报告包含借贷风险、失信等多个维度,是根据网络行为综合评估的,不包含个人隐私爬虫数据。只做大数据信息的获取及分析，不对原始数据做任何修改，仅供参考使用。如你对报告有异议，出于对合作平台数据隐私的保护，平台将不做任何解释。
					</view>
				</view>
			</uni-col>
		</uni-row>
		<template v-if="orderNo">
			<liu-drag-button @clickBtn="FX()">分享</liu-drag-button>
		</template>
	</view>
</template>

<script>
	import correctIcon from '@/static/images/correctIcon.png'
	import exponent from '@/static/images/exponent.jpg'
	import * as echarts from "echarts"
	import {
		disposeSlc,
		disposeAls,
		disposeEl,
		disDate
	} from '@/utils/duotouDis.js'

	export default {
		name: "commonReport",
		props: {
			reportData: {
				required: false,
				type: Object
			},
			orderNo: {
				default: undefined,
				type: String
			}
		},
		watch: {
			reportData(val) {
				this.disData(val)
			}
		},
		data() {
			return {
				name: undefined,
				cardNo: undefined,
				endTime: undefined,


				ExecutionLimited: {
					fysx: [],
					fyxg: []
				},
				correctIcon,
				exponent,
				sl_id_allnum: 0,
				sl_cell_allnum: 0,
				myChartStyle: {
					width: "100%",
					height: "400px"
				}, //图表样式
				searchTimeIndex: 0,
				searchTime: ['近15天', '近1个月', '近3个月', '近6个月', '近12个月'],
				searchTextData: [{
						title: '机构类别统计',
						item: ['传统银行', '网络零售银行', '非银-p2p机构汇总', '非银-小贷机构汇总', '非银-现金类汇总', '非银-消费类汇总', '非银-代偿类汇总',
							'非银-其他'
						]
					},
					{
						title: '申请条件统计',
						item: ['通过手机号申请', '通过身份证申请']
					},
					{
						title: '持牌类别统计',
						item: ['持牌小贷', '持牌网络小贷', '持牌消费金融', '持牌汽车金融', '持牌融资租赁']
					},
				],

				add_at: '',
				dayNum: 10,
				reportItem: [],
				searchData: [
					[
						[
							[0, 0],
							[0, 0],
							[0, 0],
							[0, 0],
							[0, 0],
							[0, 0],
							[0, 0],
							[0, 0]
						],
						[
							[0, 0],
							[0, 0]
						],
						[
							[0, 0],
							[0, 0],
							[0, 0],
							[0, 0],
							[0, 0]
						]
					],
					[
						[
							[0, 0],
							[0, 0],
							[0, 0],
							[0, 0],
							[0, 0],
							[0, 0],
							[0, 0],
							[0, 0]
						],
						[
							[0, 0],
							[0, 0]
						],
						[
							[0, 0],
							[0, 0],
							[0, 0],
							[0, 0],
							[0, 0]
						]
					],
					[
						[
							[0, 0],
							[0, 0],
							[0, 0],
							[0, 0],
							[0, 0],
							[0, 0],
							[0, 0],
							[0, 0]
						],
						[
							[0, 0],
							[0, 0]
						],
						[
							[0, 0],
							[0, 0],
							[0, 0],
							[0, 0],
							[0, 0]
						]
					],
					[
						[
							[0, 0],
							[0, 0],
							[0, 0],
							[0, 0],
							[0, 0],
							[0, 0],
							[0, 0],
							[0, 0]
						],
						[
							[0, 0],
							[0, 0]
						],
						[
							[0, 0],
							[0, 0],
							[0, 0],
							[0, 0],
							[0, 0]
						]
					],
					[
						[
							[0, 0],
							[0, 0],
							[0, 0],
							[0, 0],
							[0, 0],
							[0, 0],
							[0, 0],
							[0, 0]
						],
						[
							[0, 0],
							[0, 0]
						],
						[
							[0, 0],
							[0, 0],
							[0, 0],
							[0, 0],
							[0, 0]
						]
					]
				],
				tableData1: [],
				tableData2: [],
				tableData3: [],
				searchName: ['身份证查询', '手机号查询'],
				searchNameIndex: 0,
				searchNameData: [
					[{
							left: '法院失信人',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '法院被执行人',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '银行(含信用卡)一般风险',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '银行(含信用卡)中风险',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '银行(含信用卡)高风险',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '银行(含信用卡)高风险',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '银行(含信用卡)拒绝',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-持牌网络小贷一般风险',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-持牌网络小贷中风险',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-持牌网络小贷高风险',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-持牌网络小贷资信不佳',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-持牌网络小贷拒绝',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-持牌小贷中风险',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-持牌小贷高风险',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-持牌小贷资信不佳',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-持牌小贷拒绝',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-持牌消费金融一般风险',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-持牌消费金融中风险',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-持牌消费金融高风险',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-持牌消费金融资信不佳',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-持牌消费金融拒绝',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-持牌融资租赁高风险',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-持牌融资租赁资信不佳',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-持牌融资租赁拒绝',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-持牌汽车金融一般风险',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-持牌汽车金融中风险',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-持牌汽车金融高风险',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-持牌汽车金融资信不佳',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-(信保、信托等)拒绝',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-(信保、信托等)一般风险',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-(信保、信托等)中风险',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-(信保、信托等)高风险',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-(信保、信托等)资信不佳',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-(信保、信托等)拒绝',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
					],
					[{
							left: '银行-(含信用卡)一般风险',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '银行-(含信用卡)中风险',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '银行-(含信用卡)高风险',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '银行-(含信用卡)资信不佳',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '银行-(含信用卡)拒绝',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-持牌网络小贷一般风险',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-持牌网络小贷中风险',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-持牌网络小贷高风险',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-持牌网络小贷资信不佳',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-持牌网络小贷拒绝',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-持牌小贷中风险',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-持牌小贷高风险',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-持牌小贷资信不佳',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-持牌小贷拒绝',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-持牌消费金融一般风险',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-持牌消费金融中风险',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-持牌消费金融高风险',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-持牌消费金融资信不佳',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-持牌消费金融拒绝',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-持牌融资租赁高风险',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-持牌融资租赁资信不佳',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-持牌融资租赁拒绝',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-持牌汽车金融一般风险',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-持牌汽车金融中风险',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-持牌汽车金融高风险',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-持牌汽车金融资信不佳',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-(信保、信托等)拒绝',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-(信保、信托等)一般风险',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-(信保、信托等)中风险',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-(信保、信托等)高风险',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-(信保、信托等)资信不佳',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						},
						{
							left: '非银-(信保、信托等)拒绝',
							right: '未命中',
							smallLeft: '0',
							smallRight: '无',
							check: false
						}
					]
				],
				implementData: [],
				yData: [0, 0, 0, 0, 0], //申请次数
				taskDate: [0, 0, 0, 0, 0] //申请机构
			}
		},
		mounted() {
			this.disData(this.reportData)
		},
		methods: {

			disData(data) {
				this.name = data.name
				this.cardNo = data.cardNo
				this.endTime = data.endTime

				let ret = data.dttz
				if(ret && ret.retcode == '4005'){
					this.$modal.msgLoading('系统异常'+ret.retmsg)
					return
				}
				
				try {
					if (ret && ret.retcode == '000000') { // 查询成功
						let retdata = ret.retdata
						if (retdata.code == '00') { // 查询成功命中数据
							if (retdata.Flag.riskstrategy == '1') {
								console.log('-----推荐策略------')
								// this.$emit('scoreEvent', parseInt(retdata.Rule.result.final_weight))
							}
							if (retdata.Flag.ruleexecutionlimited == '1') {
								const r = retdata.Rule.hit_rules.ruleexecutionlimited
								for (const key in r) {
									this.reportItem.push(r[key])
								}
							}
							if (retdata.Flag.rulespeciallist_c == '1') {
								const r = retdata.Rule.hit_rules.rulespeciallist_c
								for (const key in r) {
									this.reportItem.push(r[key])
								}
							}
							if (retdata.Flag.ruleapplyloan == '1') {
								const r = retdata.Rule.hit_rules.ruleapplyloan
								for (const key in r) {
									this.reportItem.push(r[key])
								}
							}
							if (retdata.Flag.specialList_c == '1') {
								const slc = disposeSlc(retdata.SpecialList_c)
								this.sl_id_allnum = slc.id_allnum
								this.sl_cell_allnum = slc.cell_allnum
								this.searchNameData = slc.searchNameData
							}
							// 评估个体近7/15天、1/3/6/12个月的多次申请信贷情况。
							if (retdata.Flag.applyloanstr == '1') {
								const als = disposeAls(retdata.ApplyLoanStr);
								this.yData = als.allnum
								this.taskDate = als.orgnum
								this.searchData = als.searchData
								this.tableData1 = als.tableData1
								this.tableData2 = als.tableData2
								this.tableData3 = als.tableData3
							}
							if (retdata.Flag.executionlimited == '1') {
								this.ExecutionLimited = disposeEl(retdata.ExecutionLimited)
							}
						}
						this.initEcharts()
						return
					}
				} catch (err) {
					console.error('渲染异常：' + err)
				}
			},
			// changeSearchTimeIndex(index) {
			// 	this.searchTimeIndex = index
			// },
			// changeSearchNameIndex(index) {
			// 	this.searchNameIndex = index
			// },
			cellStyle({
				columnIndex
			}) {
				if (columnIndex === 0) {
					return {
						'font-size': '8px',
						'font-weight': '600'
					}
				} else {
					return {
						'font-size': '8px',
						'font-weight': '600',
						'color': '#1d98fe',
						'text-align': 'center'
					}
				}
			},
			initEcharts() {
				// 多列柱状图
				const mulColumnZZTData = {
					xAxis: {
						data: ['15天', '1个月', '3个月', '6个月', '12个月']
					},
					// 图例
					legend: {
						data: ["申请次数", "申请机构"],
						top: "0%"
					},
					yAxis: {},
					series: [{
							type: "bar", //形状为柱状图
							data: this.yData,
							name: "申请次数", // legend属性
							label: {
								// 柱状图上方文本标签，默认展示数值信息
								show: true,
								position: "top"
							}
						},
						{
							type: "bar", //形状为柱状图
							data: this.taskDate,
							name: "申请机构", // legend属性
							label: { // 柱状图上方文本标签，默认展示数值信息
								show: true,
								position: "top"
							}
						}
					]
				}
				this.$nextTick(() => {
					const myChart = echarts.init(document.getElementById("mychart"));
					myChart.setOption(mulColumnZZTData);
					//随着屏幕大小调节图表
					window.addEventListener("resize", () => {
						myChart.resize();
					})
				})
			}
		}
	}
</script>

<style scoped>
	.fixed {
		bottom: 6px;
		position: fixed;
		z-index: 10;
		text-align: center;
	}

	.btn {
		bottom: 14px;
		right: 20px;
		position: fixed;
		z-index: 10;
		text-align: center;
	}

	.pageRoot {
		background-image: url("@/static/images/infoBg.png");
		background-size: 100% 100%;
		background-repeat: no-repeat;
		background-color: #eee;
		display: flex;
		flex-direction: column;
		align-items: center;
		min-height: 1101px;
	}

	@media screen and (min-width: 768px) {
		.pageRoot {
			width: 50%;
			background-image: url("@/static/images/infoBg.png");
			background-size: 100% 100%;
			background-repeat: no-repeat;
			background-color: #eee;
			display: flex;
			flex-direction: column;
			align-items: center;
			min-height: 1101px;
		}
	}

	.pageRoot>>>.el-progress__text {
		color: #E6A23C;
		font-size: 20px !important;
	}

	.pageRoot>>>.el-table .el-table__cell {
		padding: 6px 0;
	}

	.report {
		font-size: 14px;
		color: #fff;
		margin: 10px 0 5px;
	}

	.reportTime {
		font-size: 10px;
		color: #fff;
		padding: 1px 9px;
		background: rgba(0, 0, 0, .14);
		border-radius: 8px;
		box-sizing: border-box;
	}

	.reportModel {
		display: flex;
		flex-direction: column;
		align-content: center;
		align-items: center;
		background: #feffff;
		border-radius: 10px;
	}

	.reportModel .charts {
		width: 100%;
		margin-top: 10px;
	}

	.reportModel .title {
		width: 100%;
		display: flex;
	}

	.reportModel .title .left {
		background-image: url();
		height: 45px;
		font-size: 17px;
		color: #00568b;
		background-size: cover;
		width: 123px;
		padding-left: 15px;
		box-sizing: border-box;
		font-weight: 600;
		line-height: 45px;
	}

	.reportModel .fraction {
		display: flex;
		justify-content: space-between;
		padding: 23px 0 15px;
		width: 90%;
	}

	.reportModel .fraction .item {
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		padding: 5px 0;
		box-sizing: border-box;
		background: rgba(26, 116, 255, .04);
		border-radius: 4px;
		border: 1px solid #1a74ff;
		font-size: 14px;
		color: #1a74ff;
		width: 17%;
		align-items: center;
		font-weight: 600;
	}

	.reportModel .fraction .itemActive {
		border: 1px solid rgb(252, 99, 29) !important;
		color: rgb(252, 99, 29) !important;
	}

	.reportModel .reportText {
		color: #999;
		margin: 15px 15px 26px;
		width: 90%;
	}

	.reportModel .resImg {
		height: 58px;
		position: absolute;
		top: 625px;
		right: 25px;
	}

	.reportModel .userInfo {
		display: flex;
		flex-direction: column;
		background: #eaf7ff;
		border-radius: 5px;
		margin: 15px 15px 0;
		padding: 10px 0 10px 15px;
		box-sizing: border-box;
		font-size: 14px;
		color: #4c5253;
		width: 90%;
	}

	.reportModel .reportNumber {
		padding: 15px 0 26px;
		box-sizing: border-box;
		border-bottom: 1px solid #eee;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
		font-size: 14px;
		color: #333;
		width: 90%;
	}

	.reportModel .tOInfo {
		box-sizing: border-box;
		margin-top: 15px;
		width: 90%;
		display: flex;
		flex-direction: column;
	}

	.reportModel .tOInfo .tOTitle {
		font-size: 15px;
		color: #333;
		margin-bottom: 5px;
	}

	.reportModel .tOInfo .tODesc {
		font-size: 12px;
		color: #999;
	}

	.reportModel .tOInfo .tOList {
		display: flex;
		flex-direction: column;
		background: #fef3ef;
		border-radius: 5px 5px 15px 5px;
		margin-top: 10px;
		padding: 10px 15px 0;
	}

	.reportModel .tOInfo .tOList .tOItem {
		display: flex;
		align-items: center;
		font-size: 14px;
		color: #333;
		margin-bottom: 15px
	}

	.reportModel .explain {
		margin-top: 15px;
		border-radius: 5px;
		display: flex;
		flex-direction: column;
	}

	.reportModel .explain .explainTitle {
		color: rgb(102, 102, 102);
		background: linear-gradient(90deg, rgb(216, 216, 216), rgb(238, 238, 238));
		padding: 5px 10px;
		box-sizing: border-box;
		font-size: 17px;
		font-weight: 600;
		border-radius: 5px 5px 0 0;
	}

	.reportModel .explain .explainDesc {
		background-color: rgb(246, 246, 246);
		color: rgb(102, 102, 102);
		padding: 15px 10px;
		box-sizing: border-box;
		font-size: 14px;
		border-radius: 0 0 5px 5px;
	}

	.reportModel .proposal {
		margin: 15px 0px;
		background-color: rgb(231, 245, 251);
		border-radius: 5px;
		display: flex;
		flex-direction: column;
	}

	.reportModel .proposal .proposalTitle {
		color: rgb(7, 141, 255);
		background: linear-gradient(90deg, rgb(188, 237, 255) 0%, rgba(238, 238, 238, 0) 100%);
		padding: 5px 10px;
		box-sizing: border-box;
		font-size: 17px;
		font-weight: 600;
		border-radius: 5px 5px 0 0;
	}

	.reportModel .proposal .proposalDesc {
		background-color: rgb(231, 245, 251);
		color: rgb(47, 158, 255);
		padding: 15px 10px;
		box-sizing: border-box;
		font-size: 14px;
		border-radius: 0 0 5px 5px;
	}

	.reportModel .credit {
		background-image: url("@/static/images/quotaBg.png");
		background-size: 100% 100%;
		background-repeat: no-repeat;
		height: 103px;
		margin-bottom: 15px;
		display: flex;
	}

	.reportModel .credit .creditContent {
		width: 50%;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		padding: 8px 0;
		box-sizing: border-box;
		font-size: 14px;
		font-weight: 600;
		color: #feffff;
	}

	.reportModel .risk {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		font-size: 12px;
		color: #666;
		margin-top: 10px;
		width: 90%;
	}

	.reportModel .risk .riskImg {
		height: 90px;
		margin-top: 10px
	}

	.reportModel .risk .riskText {
		font-size: 12px;
		color: #666;
	}

	.reportModel .hit {
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: space-around;
		margin: 15px 0;
		width: 90%;
	}

	.reportModel .hit .hitContent {
		display: flex;
		flex-direction: column;
		align-items: center;
		font-size: 14px;
		color: #333;
		margin-bottom: 18px;
		font-weight: 600;
	}

	.reportModel .searchTime {
		width: 90%;
		display: flex;
		justify-content: space-between;
		margin-top: 15px;
	}

	.reportModel .searchTime .timeItem {
		background-color: rgba(0, 130, 240, 0.1);
		color: rgb(0, 130, 240);
		height: 30px;
		border-radius: 15px;
		width: 18%;
		font-size: 12px;
		text-align: center;
		line-height: 30px;
	}

	.reportModel .searchTime .timeItemActive {
		background: #3889ff !important;
		color: white !important;
	}

	.reportModel .searchContent {
		display: flex;
		flex-direction: column;
		width: 90%;
	}

	.reportModel .searchContent .searchTitle {
		font-size: 16px;
		font-weight: 600;
		color: #333;
		position: relative;
		z-index: 10;
		margin: 15px 0;
	}

	.reportModel .searchContent .searchHr {
		position: absolute;
		bottom: 0;
		width: 100px;
		background: #0066ef;
		opacity: .28;
		height: 6px;
	}

	.reportModel .searchContent .searchText {
		font-size: 14px;
		font-weight: 600;
		color: #999;
		padding: 15px 0;
		border-bottom: 0.5px solid #eee;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
	}

	.reportModel .reportTable {
		display: flex;
		flex-direction: column;
		width: 90%;
	}

	.reportModel .reportTable .tableTitle {
		font-size: 14px;
		font-weight: 600;
		margin-bottom: 15px;
	}

	.reportModel .searchContent .searchName {
		display: flex;
		flex-direction: column;
		padding: 15px 0;
		box-sizing: border-box;
		border-bottom: 0.5px solid #eee;
	}

	.reportModel .searchContent .searchName .searchNameUp {
		font-size: 14px;
		font-weight: 600;
		color: #999;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		margin-bottom: 5px;
	}

	.reportModel .searchContent .searchName .searchNameUpActive {
		color: rgb(250, 100, 0) !important;
	}

	.reportModel .searchContent .searchName .searchNameDown {
		font-size: 12px;
		color: #999;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
	}

	.reportModel .content {
		font-size: 14px;
		color: rgb(153, 153, 153);
		margin-bottom: 0px;
		margin: 15px 0;
		width: 90%;
	}

	.reportModel .implementTitle {
		margin: 9px 0;
		font-size: 14px;
		font-weight: 600;
		color: #333;
		width: 90%;
	}

	.reportModel .implementContent {
		font-size: 14px;
		color: #333;
		background: #f8f8f8;
		border-radius: 5px;
		display: flex;
		flex-direction: column;
		padding: 9px;
		box-sizing: border-box;
		width: 90%;
	}

	.reportModel .implementContent .implementItem {
		font-size: 14px;
		color: #333;
		margin-bottom: 5px;
	}
</style>